<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>

<div class="page-header">
    <h1>
        修改密码
    </h1>
</div>

<div class="row" style="margin-top:5px;">
    <div class="col-xs-12">
        <form id="userPassword" name="userPassword" class="form-horizontal" role="form" method="post">
            <input type="hidden" name="id" value="${userEntity.id }">
            <input type="hidden" name="userName" value="${userEntity.userName }">
            <input type="hidden" name="accountName" value="${userEntity.accountName }"/>
            <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right" for="password">新密码</label>
                <div class="col-sm-10">
                    <div class="clearfix">
                        <input class="form-control" name="password" id="password" type="password"
                               value="" placeholder="密码..."/>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label class="control-label col-sm-1 no-padding-right" for="repassword">确认密码</label>
                <div class="col-sm-10">
                    <div class="clearfix">
                        <input class="form-control" name="repassword" id="repassword" type="password"
                               value="" placeholder="确认密码..."/>
                    </div>
                </div>
            </div>
        </form>
        <div class="hr hr-dotted"></div>
    </div>
</div>
<div class="center">
    <button id="btnAdd" type="button" class="btn btn-success btn-sm">
        <i class="fa fa-user-plus"></i>&nbsp;保存
    </button>
    <button id="btnBack" type="button" class="btn btn-info btn-sm">
        <i class="fa fa-undo"></i>&nbsp;返回
    </button>
</div>
<script type="text/javascript">

    $(function () {
        initButtonClick();
        validateUserPasswordForm();
    });


    /**
     * 初始化绑定按钮事件
     */
    function initButtonClick() {
        $("#btnAdd").click(function () {
            $('#userPassword').submit();
        });

        $("#btnBack").click(function () {
            top.location.href = '../../index.html';
        });
    }

    /**
     * 初始化表达验证
     */
    function validateUserPasswordForm() {
        $('#userPassword').validate({
            errorElement: 'div',
            errorClass: 'help-block',
            focusInvalid: false,
            ignore: "",
            rules: {
                password: {
                    required: true,
                    minlength: 6
                },
                repassword: {
                    required: true,
                    minlength: 6,
                    equalTo: "#password"
                }
            },
            messages: {
                password: {
                    required: "请填写密码",
                    minlength: "密码长度不能少于6个字符"
                },
                repassword: {
                    required: "请再次填写密码",
                    minlength: "密码长度不能少于6个字符",
                    equalTo: "两次填写密码不一致，请重新填写"
                }
            },
            highlight: function (e) {
                $(e).closest('.form-group').removeClass('has-info').addClass('has-error');
            },
            success: function (e) {
                $(e).closest('.form-group').removeClass('has-error').addClass('has-success');
                $(e).remove();
            },
            errorPlacement: function (error, element) {
                error.insertAfter(element.parent());
            },
            submitHandler: function (form) {
                commitPassword('userPassword', '/user/password.html', '/logout.html');
            },
            invalidHandler: function (form) {

            }
        });
    }


    /**
     * 修改密码提交表单
     * 适用场景：form表单的提交，主要用在修改密码
     * @param {Object} commitUrl 表单提交地址
     * @param {Object} listUrl 表单提交成功后转向的列表页地址
     */
    function commitPassword(formId, commitUrl, jumpUrl) {
        //组装表单数据
        var index;
        var data = $("#" + formId).serialize();
        $.ajax({
            type: "POST",
            url: sys.rootPath + commitUrl,
            data: data,
            dataType: "json",
            beforeSend: function () {
                index = layer.load();
            },
            success: function (result) {
                layer.close(index);
                if (result.success === 200) {
                    layer.confirm(result.message, {
                        icon: 3,
                        title: '提示'
                    }, function (index, layero) {
                        window.location.href = sys.rootPath + jumpUrl;
                    });
                } else {
                    layer.msg(result.message, {
                        icon: 5
                    });
                }

            },
            error: function (data) {
                layer.close(index);
                layer.msg(data.responseText, {
                    icon: 2
                });
            }
        });
    }
</script>